<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Insert title here</title>
</head>
<body>
	<%@include file="../common/top.jsp"%>
	<div>
		<div id="search" style="margin-left: 15px; margin-top: 15px;">
			<form class="form-inline" role="form" action="" method="post"
				id="searchForm">
				<div class="form-group">
					<label for="leaveName"><span class="local"
						data-local="leave_search_person">请假人：</span></label> <input type="text"
						class="form-control" id="leaveName" placeholder="搜索：张三（ZS）"
						name="empName">
				</div>
				<div class="form-group" style="margin-left: 15px;">
					<label for="leaveTime"><span class="local"
						data-local="leave_search_time">请假时间：</span></label> <input type="text"
						id="leaveTime" class="form-control" name="leaveDate">
				</div>
				<button type="button" class="btn btn-primary" onclick="search()"
					style="margin-left: 20px">
					<span class="local" data-local="leave_search_btn_submit">提交</span>
				</button>
				<button type="button" class="btn btn-primary pull-right"
					onclick="batchUpdate()" style="margin-left: 20px">
					<span class="local" data-local="leave_btn_batch_update">批量修改</span>
				</button>
				<button type="button" class="btn btn-primary pull-right"
					onclick="batchDelete()" style="margin-left: 20px">
					<span class="local" data-local="leave_btn_batch_delete">批量删除</span>
				</button>

				<button type="button" class="btn btn-primary pull-right"
					style="margin-left: 20px"
					data-toggle="modal" data-target="#addLeaveModal">
					<span class="local" data-local="nav_leave_add">添加请假</span>
				</button>
			</form>
		</div>

		<div id="leaveBillTable">
			<table class="table table-hover table-bordered">
				<caption>
					<span class="label pull-left"
						style="font-family: white; font-size: 16px"><span
						class="local" data-local="leave_title">员工请假列表：</span></span>
				</caption>
				<thead>
					<tr>
						<td><span class="local" data-local="leave_tbl_id">ID</span></td>
						<td><span class="local" data-local="leave_tbl_person">请假人</span></td>
						<td><span class="local" data-local="leave_tbl_days">请假天数</span></td>
						<td><span class="local" data-local="leave_tbl_reason">请假事由</span></td>
						<td><span class="local" data-local="leave_tbl_desc">请假备注</span></td>
						<td><span class="local" data-local="leave_tbl_time">请假时间</span></td>
						<td><span class="local" data-local="leave_tbl_status">请假状态</span></td>
						<td><span class="local" data-local="leave_tbl_operator">操作</span></td>
					</tr>
				</thead>
				<tbody id="leaveBillBody">
					<!-- c:forEach items="leaveBillList" var="leaveBill"
				报错：javax.el.PropertyNotFoundException: Property 'id' not found on type java.lang.String
			 -->
					<!-- 改为异步调用 -->
					<%-- <c:forEach items="${leaveBillListForPage.data }" var="leaveBill">
						<tr>
							<td>${leaveBill.id }</td>
							<td>${leaveBill.name }</td>
							<td>${leaveBill.days }</td>
							<td>${leaveBill.content }</td>
							<td>${leaveBill.remark }</td>
							<td><fmt:formatDate value="${leaveBill.leavedate }"
									pattern="yyyy-MM-dd HH:mm:ss" /></td>
							<td><c:if test="${leaveBill.state==0 }">
							初始录入
						</c:if> <c:if test="${leaveBill.state==1 }">
							正在审批
						</c:if> <c:if test="${leaveBill.state==2 }">
							审批完成
						</c:if></td>
							<td>
							<a href="javascript:void(0);"
								onclick="updateLeaveBill('${leaveBill.id }','${leaveBill.days }','${leaveBill.content }','${leaveBill.remark }')">修改</a>
							<a href="javascript:void(0)"
								onclick="deleteLeaveBill('${leaveBill.id }')">删除</a> 
								<c:if
									test="${leaveBill.state==0 }">
									<a href="startProcess.do?id=${leaveBill.id }">申请请假</a>
									<a href="javascript:void(0);"
										onclick="startProcess('${leaveBill.id }')">申请请假</a>
								</c:if> <c:if test="${leaveBill.state!=0 }">
									<a href="viewHisComment.do?id=${leaveBill.id }">查看审核记录</a>
								</c:if></td>
						</tr>
					</c:forEach> --%>
				</tbody>
			</table>
		</div>
		<div class="pull-left">
			<span style="color: red;"><span class="local"
				data-local="leave_tip">Tip:点击页面，支持键盘方向键翻页</span></span>
		</div>
		<div class="pull-right">
			<ul id='leavePage' style="cursor: pointer;"></ul>
			<!-- js控制 
			<ul class="pagination">
				<li><a href="#" title="首页">&lt;&lt;</a></li>
				<li><a href="#" title="上一页">&lt;</a></li>
				<li><a href="#">1</a></li>
				<li><a href="#">2</a></li>
				<li><a href="#">3</a></li>
				<li><a href="#">4</a></li>
				<li><a href="#">5</a></li>
				<li><a href="#" title="下一页">&gt;</a></li>
				<li><a href="#" title="末页">&gt;&gt;</a></li>
			</ul> -->
		</div>
	</div>
	<!-- 批量修改 -->
	<div class="modal fade" id="batchUpdateModal" tabindex="-1"
		role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header"
					style="font-size: 16px; background-color: #428BCA; color: white;">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×</button>
					<h4 class="modal-title" id="myModalLabel">
						<b><span class="local" data-local="leave_batch_update_title">批量修改请假申请</span></b>
					</h4>
				</div>
				<div class="modal-body">
					<form class="form-horizontal" role="form" id="" action="">
						<input type="hidden" name="id" id="batchLeaveBillId">
						<div class="form-group">
							<label for="firstname" class="col-sm-2 control-label"><span
								class="local" data-local="leave_batch_update_day">请假天数:</span></label>
							<div class="col-sm-10">
								<div class="input-group spinner" data-trigger="spinner"
									id="spinner">
									<input type="text" class="form-control" name="days"
										id="batchLeaveBillDays" placeholder="请输入请假天数" value="1"
										data-max="10" data-min="1" data-step="1">
									<div class="input-group-addon">
										<a href="javascript:;" class="spin-up" data-spin="up"><i
											class="glyphicon glyphicon-chevron-up"></i></a> <a
											href="javascript:;" class="spin-down" data-spin="down"><i
											class="glyphicon glyphicon-chevron-down"></i></a>
										<!-- <a href="javascript:;" class="spin-up" data-spin="up"><i class="icon-sort-up"></i></a>
										<a href="javascript:;" class="spin-down" data-spin="down"><i class="icon-sort-down"></i></a> -->
									</div>
								</div>
							</div>
						</div>
						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label"><span
								class="local" data-local="leave_batch_update_reason">请假原因:</span></label>
							<div class="col-sm-10">
								<input type="text" class="form-control" name="content"
									id="batchLeaveBillContent" placeholder="请输入请假原因">
							</div>
						</div>
						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label"><span
								class="local" data-local="leave_batch_update_desc">备注:</span></label>
							<div class="col-sm-10">
								<textarea class="form-control" rows="3" name="remark"
									id="batchLevaveBillRemark" style="resize: none;"></textarea>
							</div>
						</div>
					</form>
				</div>
				<div class="modal-footer">
					<ul class="pager" style="cursor: pointer;">
						<li class="previous"><a href="javascript:void(0);"
							onclick="prev();">&larr; <span class="local"
								data-local="leave_batch_update_prev">上一页</span></a></li>
						<li><button type="button" class="btn btn-primary btn-sm"
								onclick="doBatchUpdate();">
								<span class="local" data-local="leave_batch_update_ok">全部修改完毕</span>
							</button></li>
						<li>
							<button type="button" class="btn btn-primary btn-sm">
								总共：<span id="totalForBatchUpdate"></span>页，当前<span
									id="currForBatchUpdate"></span>页
							</button>
						</li>
						<li class="next"><a href="javascript:void(0);"
							onclick="next();"><span class="local"
								data-local="leave_batch_update_next">下一页 </span>&rarr;</a></li>
					</ul>
				</div>
			</div>
		</div>
	</div>





	<!-- 模态框（Modal）修改 -->
	<div class="modal fade" id="updateModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header"
					style="font-size: 16px; background-color: #428BCA; color: white;">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×</button>
					<h4 class="modal-title" id="myModalLabel">
						<b><span class="local" data-local="leave_update_title">修改请假申请</span></b>
					</h4>
				</div>
				<div class="modal-body">
					<form class="form-horizontal" role="form" id="addOrUpdateForm"
						action="">
						<input type="hidden" name="id" id="updateLeaveBillId">
						<div class="form-group">
							<label for="firstname" class="col-sm-2 control-label"><span
								class="local" data-local="leave_update_days">请假天数:</span></label>
							<div class="col-sm-10">
								<div class="input-group spinner" data-trigger="spinner"
									id="spinner">
									<input type="text" class="form-control" name="days"
										id="updateLeaveBillDays" placeholder="请输入请假天数" value="1"
										data-max="10" data-min="1" data-step="1">
									<div class="input-group-addon">
										<a href="javascript:;" class="spin-up" data-spin="up"><i
											class="glyphicon glyphicon-chevron-up"></i></a> <a
											href="javascript:;" class="spin-down" data-spin="down"><i
											class="glyphicon glyphicon-chevron-down"></i></a>
										<!-- <a href="javascript:;" class="spin-up" data-spin="up"><i class="icon-sort-up"></i></a>
										<a href="javascript:;" class="spin-down" data-spin="down"><i class="icon-sort-down"></i></a> -->
									</div>
								</div>
							</div>
						</div>
						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label"><span
								class="local" data-local="leave_update_reason">请假原因:</span></label>
							<div class="col-sm-10">
								<input type="text" class="form-control" name="content"
									id="updateLeaveBillContent" placeholder="请输入请假原因">
							</div>
						</div>
						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label"><span
								class="local" data-local="leave_update_remark">备注:</span></label>
							<div class="col-sm-10">
								<textarea class="form-control" rows="3" name="remark"
									id="updateLevaveBillRemark" style="resize: none;"></textarea>
							</div>

						</div>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">
						<span class="local" data-local="leave_update_close">关闭</span>
					</button>
					<button type="button" class="btn btn-primary" id="submitUpdate">
						<span class="local" data-local="leave_update_ok">提交更改</span>
					</button>
				</div>
			</div>
		</div>
	</div>
	
	
	
	
	
	<!-- 模态框（Modal） -->
	<div class="modal fade" id="addLeaveModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header"  style="font-size: 16px;background-color: #428BCA; color: white; ">
					<button type="button" class="close" data-dismiss="modal"
						aria-hidden="true">×</button>
					<h4 class="modal-title" id="myModalLabel"><b><span class="local" data-local="leave_add_title">新增请假申请</span></b></h4>
				</div>
				<div class="modal-body">
					<form class="form-horizontal" role="form" id="addForm"
						action="" method="post">
						<input type="hidden" name="id" id="leaveBillId">
						<div class="form-group">
							<label for="firstname" class="col-sm-2 control-label"><span class="local" data-local="leave_add_input_day">请假天数:</span></label>
							<div class="col-sm-10">
								<div class="input-group spinner" data-trigger="spinner"
									id="spinner">
									<input type="text" class="form-control" name="days"
										id="leaveBillDays" placeholder="请输入请假天数" value="1"
										data-max="10" data-min="1" data-step="1">
									<div class="input-group-addon">
										<a href="javascript:;" class="spin-up" data-spin="up"><i
											class="glyphicon glyphicon-chevron-up"></i></a> <a
											href="javascript:;" class="spin-down" data-spin="down"><i
											class="glyphicon glyphicon-chevron-down"></i></a>
										<!-- <a href="javascript:;" class="spin-up" data-spin="up"><i class="icon-sort-up"></i></a>
											<a href="javascript:;" class="spin-down" data-spin="down"><i class="icon-sort-down"></i></a> -->
									</div>
								</div>

							</div>
						</div>
						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label"><span class="local" data-local="leave_add_input_reason">请假原因:</span></label>
							<div class="col-sm-10">
								<input type="text" class="form-control" name="content"
									id="leaveBillContent" placeholder="家中有事" required="required"
									data-provide="typeahead"  data-source='["家中有事", "身体不舒服", "老婆怀孕","私人事情"]'>
									<!-- ["元旦", "春节", "清明节","劳动节","端午节","中秋节","国庆节"] -->
							</div>
						</div>
						<div class="form-group">
							<label for="lastname" class="col-sm-2 control-label"><span class="local" data-local="leave_add_input_remark">备注:</span></label>
							<div class="col-sm-10">
								<textarea class="form-control" rows="3" name="remark"
									id="levaveBillRemark" style="resize: none;"></textarea>
							</div>

						</div>	
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal"><span class="local" data-local="leave_add_btn_close">关闭</span>
					</button>
					<button type="button" class="btn btn-primary" id="submitAdd"><span class="local" data-local="leave_add_btn_ok">确认请假</span></button>
				</div>
			</div>
		</div>
	</div>
	
	<!-- 一开始的时候modal就显示 -->
	<!-- <script>
		$(function() {
			$('#myModal').modal({
				keyboard : true
			})
		});
	</script> -->
	<%-- <%@include file="../common/commons.jspf" %> --%>
	<script type="text/javascript"
		src="${basePath }static/js/leave_manager.js"></script>
</body>
</html>